<template>
	<div class="cmt-container">
		<h3>发表评论</h3>
		<hr>
		<textarea placeholder="请输入要评论的内容，最多120字哦" maxlength="120" v-model="msg"></textarea>
		<mt-button type='primary' size="large" @click='postComment'>发表评论</mt-button>
		<div class="cmt-list">
			<!--<div class="cmt-item">
				<div class='cmt-title' v-for='(item,i) in comments' :key='item.add_time'>
					第{{i+1}}楼&nbsp;&nbsp;用户:{{item.user_name}}&nbsp;&nbsp;发表时间:{{item.add_time}}
				</div>
				<div class="cmt-body">
					{{item.content=='undefined'?'啥都没说'：'item.content'}}
				</div>
			</div>
            	
            -->
			<div class="cmt-item">
				<div class='cmt-title'>
					第一楼&nbsp;&nbsp;用户&nbsp;&nbsp;发表时间2020-06-13
				</div>
				<div class="cmt-body">
					哈哈哈哈 我也要去摆摊！
				</div>
			</div>
			<div class="cmt-item">
				<div class='cmt-title'>
					第二楼&nbsp;&nbsp;用户&nbsp;&nbsp;发表时间2020-06-13
				</div>
				<div class="cmt-body">
					哈哈哈哈 我也要去摆摊！
				</div>
			</div>
		</div>
		<!--<mt-button type='primary' size="large" plain @click='getMoreComments()'>加载更多</mt-button>-->
	</div>
</template>

<script>
	/*import { Toast } from "mint-ui";
	export default{
		data(){
			return {
				pageIndex=1//默认展示第一页
				comments:[],
				mag:''//评论输入方睿内容
			}
		},
		created(){
			this.getComments()
		}
		methods:{
			getComments(){
				this.$http
				.get("#"#+this.id+"?pageindex=")
				.then(result => {
                // console.log(result.body);
                   if (result.body.status == 0) {
                // 成功了
                   this.comments=this.comments.concat(result.body.message);//新数据与老数据清空
                   } else {
                // 失败的
                      Toast("获取评论失败失败。。。");
                          }
			    });
			},
			getMoreComments(){
				this.pageIndex++
				this.getComments()
			},
			postComments(){
				//校验msg是不是为空
				if(this.msg.trim()==0){
					return Toast('评论不能为空')
				}
				//参数1 请求的Url地址
				//参数2 提交给服务器的数据对象{content:this.msg}
				//参数3 定义提交的时候 表单中的数据格式 {emulateJson:true} 全局设置了 
				this.$http
				.post("#"+$router.params.id,{content:this.msg.trim()})
				.then(result => {
                // console.log(result.body);
                   if (result.body.status == 0) {
                // 成功了
                var cmt={ user_name:'匿名用户'，add_time:Data.now(),content:this.msg.trim()}
                   this.comments.unshift(cmt)
                   this.msg=''
                   } else {
                // 失败的
                      Toast("评论输入失败。。。");
                          }
			    });
			}
		},
		props:['id']
	}*/
</script>

<style lang="scss" scoped>
.cmt-container{
	.h3{
		font-size: 18px;
	}
	textarea{
		font-size: 14px;
		height: 85px;
		margin: 0;
	}
	.cmt-list{
		margin: 5px 0;
		.cmt-item{
			font-size:13px;
			
			.cmt-title{
				line-height: 35px;
				background-color: #CCCCCC;
				
			}
			.cmt-body{
				line-height: 35px;
				text-indent: 2em;
			}
		}
	}
}
</style>